<script>
export default {
  name: "Notice",
  props: {
    noticeList: {
      type: Array,
      default: () => [],
    },
  },
  computed: {
    isEmpty() {
      return !this.noticeList?.length;
    },
  },
  mounted() {
    this.$nextTick(() => {
      setTimeout(() => {
        this.$refs.messageDrop.show();
      }, 500)
    })
  }
}
</script>

<template>
  <el-dropdown trigger="click" ref="messageDrop">
    <i class="el-icon-bell" style="font-size: 30px;color:#fff;cursor: pointer;"></i>
    <el-dropdown-menu slot="dropdown">
      <el-dropdown-item v-for="item in noticeList" :key="item.noticeId" :command="item">{{ item.noticeTitle }}</el-dropdown-item>
      <el-dropdown-item v-if="isEmpty">暂无公告</el-dropdown-item>
    </el-dropdown-menu>
  </el-dropdown>
</template>

<style scoped lang="scss">

</style>
